#define cascade(x,placeholder)
<select id="_#(x.index??)" onchange="_#(x.index??)_selectChanged('#(x.index??)')" data-type="cascade"  #(x.required??) class="form-control"   name="#(table??x.table).#(x.index??)">
    <option value></option>
</select>
#if(x.tail != null)
  <input type="hidden" id="_#(x.index??)_ext" name="#(table??x.table).#(x.tail??)" >
#end

<script type="text/javascript">
			function _#(x.index??)_selectChanged() {
					var options=$('#_#(x.index??) option:selected');
					$('#_#(x.index??)_ext').val(options.text());
					#if(x.cascadeIndex != null)
							#setLocal(_cascadeIndex = getArrayBySplit(x.cascadeIndex,","))
							var selectValue = options.attr("data-id");
					        //如果当前选型为空则清空下级关联的值
					        if(selectValue == undefined){
					        	#for(x : _cascadeIndex)
									$("#_#(x??)_ext").val("");
									$("#_#(x??)").empty();
									$("#_#(x??)").append("<option value></option>"); 
								#end
								return;
					        }
					        var cascadeType = getCascadeTypeName("#(x.type??)");
					        var queryParam = "#(x.queryParam??'')";
							if(cascadeType=="diy"){
								queryParam = queryParam.replace("selected",selectValue);
							}
							var source = "#(x.source??'')".encode();
							$.post("/cache/getcascadeListByPid/"+selectValue+"-"+cascadeType+"-"+source+"-"+encodeURI(queryParam),function(data){
								if(data.state == 'ok'){
									var nextSelectId = "";
									#for(x : _cascadeIndex)
										#if(for.index == 0)
											//获取当前需要级联的select的Id
											nextSelectId = "#_#(x??)";
										#end
										//级联选择后清除下级的值
										$("#_#(x??)_ext").val("");
										$("#_#(x??)").empty();
										$("#_#(x??)").append("<option value></option>"); 
									#end
									var dicts = data.data;
									//向当前需要级联的select的中插入下拉选项
									for(var i=0;i<dicts.length;i++){
										$(nextSelectId).append("<option data-id="+dicts[i].id+" value='"+dicts[i].code+"'>"+dicts[i].name+"</option>"); 
									}
								}
							}, "json");
					#end
			}
			
		   function _#(x.index??)_initcascade(){
			    var cascadeType = getCascadeTypeName("#(x.type??)");
				//pid type source where
				var value = $("#_#(x.index??)").val();
				var initParam = "#(x.initParam??'')";
				var pid = "#(x.pid??'')";
				if(pid == "" && initParam == ""){
					return;
				}
				var source = "#(x.source??'')".encode();
				$.post("/cache/getcascadeListByPid/"+pid+"-"+cascadeType+"-"+source+"-"+encodeURI(initParam),function(data){
					if(data.state == 'ok'){
						var dicts = data.data;
						var selected = "";
						for(var i=0;i<dicts.length;i++){
							if(dicts[i].code===value){
								selected = "selected";
							}else{
								selected = "";
							}
							$("#_#(x.index??)").append("<option "+selected+" data-id="+dicts[i].id+"  value='"+dicts[i].code+"'>"+dicts[i].name+"</option>");
						}
					}
				}, "json");
		   }
			
		   function getCascadeTypeName(type){
				if(type.indexOf("cascadeDict") >= 0){
						type = "dict";
				}else if(type == "cascadeArea"){
						type = "area";
				} else if(type == "cascadeDiy"){
					    type = "diy";
				}
				return type;
		   }
</script>
#end